<!-- 头部 -->
<div id="header">
    <div class="container h_inner">
        <ul class="l_nav">
            <li>
                <a href="/">首页</a>
                <span class="bg"></span>
            </li>
            <li>
                <a href="./index.html">华为官网</a>
                <span class="bg"></span>
            </li>
            <li>
                <a href="#">荣耀官网</a>
                <span class="bg"></span>
            </li>
            <li>
                <a href="#">花粉俱乐部</a>
                <span class="bg"></span>
            </li>
            <li>
                <a href="#">V码(优购码)</a>
                <span class="bg"></span>
            </li>
            <li>
                <a href="#">企业购</a>
                <span class="bg"></span>
            </li>
            <li>
                <a href="javascript:;">Select Region</a>
                <span class="bg"></span>
            </li>
            <li class="s_down">
                <a href="javascript:;">更多精彩 <i class="iconfont icon-shangxiajiantou"></i></a>
                <div class="b">
                    <ul>
                        <li>
                            <a href="#">EMUL</a>
                        </li>
                        <li>
                            <a href="#">应用市场</a>
                        </li>
                        <li>
                            <a href="#">华为终端云空间</a>
                        </li>
                        <li>
                            <a href="#">开发者联盟</a>
                        </li>
                    </ul>
                </div>
            </li>
        </ul>

        <ul class="r_nav">
            <li class="lif">
                <a th:if="${session.currentUser == null}" href="/login/">请登录</a>
                <a th:if="${session.currentUser == null}" href="/register">注册</a>
                <a th:if="${session.currentUser != null}" href="/selfInformation">[[${session.currentUser.username}]]</a>
                <a th:if="${session.currentUser != null}" href="/logout/">退出</a>
                <span class="bg"></span>
            </li>
            <li>
                <a href="/confirm">我的订单</a>
                <span class="bg"></span>
            </li>
            <li class="s_down">
                <a href="#">客户服务 <i class="iconfont icon-shangxiajiantou"></i></a>
                <span class="bg"></span>
                <div class="b" style="width: 84px;">
                    <ul>
                        <li>
                            <a href="#">服务中心</a>
                        </li>
                        <li>
                            <a href="#">联系客服</a>
                        </li>
                    </ul>
                </div>
            </li>
            <li>
                <a href="#">网站导航 <i class="iconfont icon-shangxiajiantou"></i></a>
                <span class="bg"></span>
            </li>
            <li>
                <a href="#">手机版 <i class="iconfont icon-shangxiajiantou"></i></a>
            </li>
            <li class="s_down cart">
                <a href="/cart/list"><i class="iconfont icon-gouwuchezhengpin"></i> 购物车</a>
<!--                <div class="empty b">-->
<!--                    <p class="p1"><i class="iconfont icon-gouwuchezhengpin"></i></p>-->
<!--                    <p class="p2">您的购物车是空的，赶紧选购吧~</p>-->
<!--                </div>-->
            </li>
        </ul>
    </div>
</div>
<!-- header下面的top部分 -->
<div id="top">
    <div class="t_inner container">
        <div class="logo">
            <a href="#" title="华为商城">
                <img src="https://res.vmallres.com/pimages//common/config/logo/SXppnESYv4K11DBxDFc2.png" alt="">
            </a>
        </div>
        <ul class="t_nav">
            <li class="lipink">
                <a href="#" style="color:#fff">华为专区</a>
            </li>
            <li class="liblue">
                <a href="#" style="color:#fff">荣耀专区</a>
            </li>
            <li>
                <a href="#">P40系列</a>
            </li>
            <li>
                <a href="#">荣耀30</a>
            </li>
            <li>
                <a href="#">智能家居</a>
            </li>
        </ul>
        <div class="search">
            <form action="#">
                <input type="text" class="txt">
                <input type="submit" class="btn">
                <i class="iconfont icon-sousuo"></i>
            </form>
            <div class="txtlink">
                <a href="#">Mate40系列</a>
                <a href="#">WATHCH FIT</a>
            </div>
            <div class="search_history">
                <dl>
                    <dt>热门搜索</dt>
                    <dd>
                        <a href="#">MateBook D</a>
                    </dd>
                    <dd>
                        <a href="#">nova8 Pro</a>
                    </dd>
                    <dd>
                        <a href="#">nova8</a>
                    </dd>
                    <dd>
                        <a href="#">平板</a>
                    </dd>
                    <dd>
                        <a href="#">华为智慧屏S</a>
                    </dd>
                    <dd>
                        <a href="#">Mate 30E pro</a>
                    </dd>
                    <dd>
                        <a href="#">耳机</a>
                    </dd>
                    <dd>
                        <a href="#">P40</a>
                    </dd>
                    <dd>
                        <a href="#">手表</a>
                    </dd>
                    <dd>
                        <a href="#">音箱</a>
                    </dd>
                </dl>
            </div>
        </div>
    </div>
</div>